import { defineConfig, loadEnv } from "vite";
import vue from "@vitejs/plugin-vue";
import path from "path";
import styleImport, { VantResolve } from "vite-plugin-style-import";
// gzip
import viteCompression from "vite-plugin-compression";
// html中使用vite环境变量
import VitePluginHtmlEnv from "vite-plugin-html-env";

// 第二步 根据不同环境 去读取 不同的 对象  进行返回
const envResolve = (mode) => {
  return loadEnv(mode, process.cwd());
};

// 第三步 传 要读取的 参数 key
const getEnv = function (env) {
  // 我这里采用了lodash 读取 环境名

  console.log("--process.argv--", process.argv);
  return envResolve("development")[env];
};

export default ({ mode }) => {
  return defineConfig({
    plugins: [
      vue(),
      styleImport({
        resolves: [VantResolve()],
      }),
      viteCompression({
        verbose: true,
        disable: false,
        threshold: 10240,
        algorithm: "gzip",
        ext: ".gz",
      }),
      VitePluginHtmlEnv(),
    ],
    base: "./",
    define: {
      "process.env": {
        NODE_ENV: loadEnv(mode, process.cwd()).MODE,
        VUE_APP_BASE_URL: loadEnv(mode, process.cwd()).VITE_BASE_URL,
        VUE_APP_NAME: loadEnv(mode, process.cwd()).VITE_APP_NAME,
      },
    },
    resolve: {
      alias: {
        "@": path.resolve(__dirname, "src"),
        "/img": "src/assets/img",
      },
    },
    server: {
      proxy: {
        "/ftapi": {
          target: "https://ftweb-test.xiaoerfang.cn:8082/ftapi",
          changeOrigin: true,
          rewrite: (path) => path.replace(/^\/ftapi/, ""),
        },
      },
    },
    build: {
      rollupOptions: {
        output: {
          chunkFileNames: "static/js/[name]-[hash].js",
          entryFileNames: "static/js/[name]-[hash].js",
          assetFileNames: "static/[ext]/[name]-[hash].[ext]",
        },
      },
    },
    css: {
      // postcss: {
      //   plugins: [
      //     require('postcss-px-to-viewport')({
      //       unitToConvert: "px",
      //       viewportWidth: 375,
      //       unitPrecision: 6,
      //       propList: ["*"],
      //       viewportUnit: "vw",
      //       fontViewportUnit: "vw",
      //       selectorBlackList: [],
      //       minPixelValue: 1,
      //       mediaQuery: true,
      //       exclude: [],
      //       landscape: false
      //     }),
      //   ],
      // },
    },
  });
};
